<template>
  <div>
    <el-form-item label="到期时间">
      <el-input v-model="userTaskForm.dueDate" clearable @change="updateElementTask('dueDate')">
        <el-button slot="append" icon="el-icon-date" @click="$refs.selectIos8610.show()"></el-button>
      </el-input>
    </el-form-item>
    <el-form-item label="优先级">
      <el-input-number v-model="userTaskForm.priority" @change="updateElementTask('priority')" :min="0" :max="100"></el-input-number>
    </el-form-item>

    <el-form-item>
      <template slot="label">
        <el-tooltip effect="dark" content="当满足配置的条件，会自动通过此节点" placement="top">
          <i class="el-icon-question"/>
        </el-tooltip>
        <span> 自动通过</span>
      </template>
      <el-select v-model="userTaskForm.autoSkipStrategy" clearable @change="updateElementTask('autoSkipStrategy')">
        <el-option label="相邻节点同一审批人" value="1"></el-option>
      </el-select>
    </el-form-item>

    <select-iso8610 v-model="userTaskForm.dueDate" @change="updateElementTask('dueDate')" ref="selectIos8610" title="任务到期时间配置"></select-iso8610>
  </div>
</template>

<script>
import SelectIso8610 from "@/../package/components/select-iso8601"
import Emitter from "../../util/emitter"

export default {
  name: "UserTask",
  mixins: [Emitter],
  components: {
    SelectIso8610
  },
  props: {
    id: String,
    type: String,
    businessObject: Object
  },
  inject: {
    prefix: "prefix",
  },
  data() {
    return {
      defaultTaskForm: {
        dueDate: "",
        followUpDate: "",
        priority: null,
        autoSkipStrategy: "",
      },
      userTaskForm: {}
    };
  },
  watch: {
    businessObject: {
      immediate: true,
      handler() {
        this.$nextTick(() => this.resetTaskForm());
      }
    }
  },
  methods: {
    resetTaskForm() {
      this.userTaskForm = {};
      this.bpmnElement = window.bpmnInstances.bpmnElement;
      // 表单数据
      for (let key in this.defaultTaskForm) {
        let value = this.bpmnElement?.businessObject[key] || this.defaultTaskForm[key];
        this.$set(this.userTaskForm, key, value);
      }
    },
    updateElementTask(key) {
      const taskAttr = Object.create(null);
      taskAttr[key] = this.userTaskForm[key] || null;
      window.bpmnInstances.modeling.updateProperties(this.bpmnElement, taskAttr);
    }
  },
  beforeDestroy() {
    this.bpmnElement = null;
  }
};
</script>
